<template>
	<view class="home">
		<image :src="shopInfo.cover" mode="aspectFill"></image>
		<view class="content">
			<view class="join-metaverse btn" @click="switchTabTo('metaverse')">
				进入元宇宙
			</view>
			<view class="chat-btn btn" @click="switchTabTo('chatgpt')">
				聊天办公GPT
			</view>
			<view class="others">
				<view class="other-btn btn" @click="navigatorToMiniProgram">
					在线点单
				</view>
				<view class="other-btn btn" @click="switchTabTo('gallery')">
					店家画廊
				</view>
			</view>
		</view>
	</view>
</template>

<script>
	import {
		userInfoApi,
		workListApi,
		albumListApi
	} from '@/api'
	export default {
		onShow() {
			uni.hideTabBar()
		},
		data() {
			return {
				shopInfo: {},
			}
		},
		onReady() {
			wx.preloadWebview({
				complete: (res) => {
					console.log(res);
				}
			})
		},
		async onLoad(query) {
			// 初始化
			uni.startWifi({
				success: () => {
					this.initWifiStatus = true;
					console.log(2)
				},
				fail: () => {
					this.initWifiStatus = false;
					console.log(3)
				},
			});
			console.log("二维码传入参数", query);
			// scene 需要使用 decodeURIComponent 才能获取到生成二维码时传入的 scene
			const id = query.scene || '315ae449a0824414b99f05e4b69fdd68'
			console.log(query);
			try {
				uni.setStorageSync('shop_u_id', id)
				this.getShopSpace(id)
				// 获取用户信息
				const result = await userInfoApi(id)
				uni.setStorageSync('shop_u_info', result)
				console.log(1);
				// 连接Wifi
				uni.getConnectedWifi({
					partialInfo: true,
					fail: () => {
						this.linkWifi()
					}
				})
			} catch (e) {
				//TODO handle the exception
				uni.showToast({
					icon: 'error',
					title: '获取门店失败，请重新进入'
				})
			}
		},
		methods: {
			linkWifi() {
				const {
					wifi_name,
					wifi_password
				} = uni.getStorageSync('shop_u_info')
				if (wifi_name && wifi_password && this.initWifiStatus) {
					uni.onWifiConnected((res) => {
						console.log(res);
					})
					uni.connectWifi({
						SSID: wifi_name,
						password: wifi_password,
						success: async (res) => {
							if (res.wifi.BSSID) {
								uni.showToast({
									icon: 'success',
									title: '连接成功'
								})
							}
						},
						fail: (error) => {
							const {
								errCode
							} = error;
							console.log(error);
							const errObj = {
								12000: "未先调用 startWifi 接口",
								12001: "当前系统不支持相关能力",
								12002: "密码错误",
								12005: "未打开 Wi-Fi 开关",
								12013: "系统保存的 Wi-Fi 配置过期，建议忘记 Wi-Fi 后重试",
								12003: "连接超时",
								12004: "重复连接 Wi-Fi",
								12006: "未打开 GPS 定位开关",
								12007: "用户拒绝授权链接 Wi-Fi",
								12008: "无效WIFI,请联系管理员",
								12009: "系统运营商配置拒绝连接 Wi-Fi",
								12010: "系统其他错误，需要在 errmsg 打印具体的错误原因",
								12011: "应用在后台无法配置 Wi-Fi",
								12013: "系统保存的 Wi-Fi 配置过期，建议忘记 Wi-Fi 后重试",
								12014: "密码错误",
							};
							uni.showToast({
								icon: 'error',
								title: errObj[errCode] || "连接失败",
							})
						},
					});
				}
			},
			switchTabTo(key) {
				uni.switchTab({
					url: `/pages/${key}/${key}`
				})
			},
			navigatorTo(key) {
				uni.navigateTo({
					url: `/pages/${key}/${key}`
				})
			},
			navigatorToMiniProgram() {
				uni.navigateToMiniProgram({
					appId: "wx50b2a26f6fb2fd44",
					success: res => {},
					fail: err => {
						uni.showToast({
							icon: 'error',
							title: '跳转失败'
						})
					}
				});
			},
			getShopSpace(id) {
				albumListApi({
					owner: id
				}).then(res => {
					this.shopInfo = res.data[0]
					uni.setStorageSync('shop_u_space', res.data[0])
				})
			}
		}
	}
</script>

<style lang="scss" scoped>
	.btn {
		background-color: #FAF8F0;
		color: #7B492E;
		font-family: base-font;
		width: max-content;
		border-bottom: 2px solid #7B492E;
		border-right: 2px solid #7B492E;
		transition: all 200ms;

		&:active {
			transform: scale(1.1);
		}
	}

	.home {
		height: 100vh;
		font-size: 20px;
		font-family: alimama;
		position: relative;

		image {
			position: absolute;
			top: 0;
			left: 0;
			height: 100%;
			width: 100%;
		}

		.content {
			position: absolute;
			bottom: 200rpx;
			left: 0;
			width: 100%;
			display: flex;
			flex-direction: column;
			justify-content: center;
			align-items: center;

			.join-metaverse {
				font-size: 75rpx;
				padding: 15rpx 60rpx;
				border-radius: 40rpx;

			}

			.chat-btn {
				font-size: 40rpx;
				width: max-content;
				padding: 20rpx 25rpx;
				margin: 40rpx 0;
				border-radius: 25rpx;

			}

			.others {
				display: flex;
				align-items: center;

				.other-btn {
					font-size: 40rpx;
					margin: 0 40rpx;
					padding: 10rpx 25rpx;
					border-radius: 25rpx;

				}
			}
		}
	}
</style>